<template>
    <div class="app-detail">
        <list-layout>
         <div slot="search">
            <el-form :model="queryParams" :inline="true" ref="queryForm" v-show="showSearch" label-width="128px">
                <el-form-item :label="$t('costPassThrough.transferOrderNumber')" prop="shiftOrder">
                    <el-input v-model="queryParams.shiftOrder"  clearable size="small" :placeholder="$t('public.inputPl')"  />
                </el-form-item>
                <el-form-item :label="$t('costPassThrough.applicant')" prop="applyName">
                    <el-input v-model="queryParams.applyName"  clearable size="small" :placeholder="$t('public.inputPl')"  />
                </el-form-item>

                <el-form-item :label="$t('specimen.sampleState')">
                    <el-select v-model="queryParams.approvalNodeStatus"  clearable  size="small"  >
                        <el-option :label="item.label"  :value="item.value" v-for="(item,i) in statuelist" :key="i"> </el-option>

                    </el-select>
                </el-form-item>
                <el-form-item :label="$t('costPassThrough.applicationTime')" prop="submitApprovalTime">
                    <el-date-picker  v-model="queryParams.submitApprovalTime" type="datetime"
                    value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" size="mini">
                    </el-date-picker>
                </el-form-item>
            </el-form>
            <div style="display: flex; justify-content: center">
                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">{{ $t("public.search") }}</el-button>
                <el-button icon="el-icon-refresh" class="resectBtn" size="mini" @click="resetQuery">{{ $t("public.reset") }}</el-button>
            </div>
        </div>

        <div class="app-container">

            <el-row :gutter="10" class="mb8 btnGroup">
                <!-- <el-col :span="1.5">
                    <el-button size="mini" type="primary"
                    icon="el-icon-s-check"  @click="addInspection">创建费用转嫁单</el-button>
                </el-col> -->

            </el-row>
            <div class="container-table">
                <el-table class="table-fixed"   ref="multipleTable"   v-loading="loading" :height="tableHeight" border
                :data="dataList"   >
                    <!-- 转嫁单号 -->
                    <el-table-column  :label="$t('costPassThrough.transferOrderNumber')" sortable  align="left" prop="shiftOrder" min-width="120" :show-overflow-tooltip="true" />
                    <!-- MRB单号 -->
                    <el-table-column :label="$t('costPassThrough.mrbTrackingNumber')" sortable  align="left" prop="mrbOrder" min-width="120" :show-overflow-tooltip="true" />
                    <!-- 标题 -->
                    <el-table-column :label="$t('costPassThrough.title')" sortable  align="left" prop="shiftTitle" min-width="120" :show-overflow-tooltip="true" />
                     <!-- 申请人 -->
                     <el-table-column :label="$t('costPassThrough.applicant')" sortable  align="left" prop="applyName" min-width="120" :show-overflow-tooltip="true" />

                    <!-- 申请部门 -->
                    <el-table-column :label="$t('costPassThrough.applicationSector')" sortable  align="left" prop="applyDeptName" min-width="120" :show-overflow-tooltip="true" />
                    <!--申请日期  -->
                    <el-table-column :label="$t('costPassThrough.dateOfApplication')" sortable  align="left" prop="submitApprovalTime" min-width="120" :show-overflow-tooltip="true" />

                    <!--  基地-->
                    <el-table-column :label="$t('basicData.baseName')" sortable  align="left" prop="baseName" min-width="120" :show-overflow-tooltip="true" />
                     <!--  工厂-->
                     <el-table-column :label="$t('costPassThrough.factory')" sortable  align="left" prop="factoryName" min-width="120" :show-overflow-tooltip="true" />
                    <!--  事业部-->
                    <el-table-column :label="$t('inspectionStandards.division')" sortable  align="left" prop="divisionName" min-width="120" :show-overflow-tooltip="true" />

                    <!--状态  -->
                    <el-table-column  :label="$t('inventoryManagement.approvalStatus')" sortable  align="left" prop="status" min-width="120" :show-overflow-tooltip="true">
                        <template slot-scope="scope">
                            <div class="action-wrap">
                                   {{ formatstatue(scope.row.approvalNodeStatus) }}
                            </div>
                        </template>
                    </el-table-column>

                    <el-table-column  :label="$t('public.opera')" fixed="right" align="center" width="140">
                        <template slot-scope="scope">
                            <div class="action-wrap">

                                <table-body-btn type="gwview" :name="$t('public.detail')"  @click.native="onInfo(scope.row)" />

                            </div>
                        </template>
                    </el-table-column>
                </el-table>

                <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" layout="total, sizes, prev, pager, next, jumper" />
            </div>
            <el-dialog :title="$t('costPassThrough.viewProcess')" :visible.sync="flowNodedia" center top="14vh" width="500px" append-to-body  >
                <el-table class="table-fixed"   ref="multipleTable"   v-loading="loading" :height="tableHeight" border
                :data="dataList"   >

                    <!-- 处理人 -->
                    <el-table-column  :label="$t('assigns.handler')" sortable  align="left" prop="approvalUserName" min-width="120" :show-overflow-tooltip="true" />
                    <!-- 时间 -->
                    <el-table-column :label="$t('costPassThrough.time')" sortable  align="left" prop="mrbOrder" min-width="120" :show-overflow-tooltip="true" />
                    <!-- 处理意见 -->
                    <el-table-column label="$t('costPassThrough.handlingOpinions')" sortable  align="left" prop="approvalNodeStatus" min-width="120" :show-overflow-tooltip="true" />
                    <!-- (0-待审批;1-审批通过;2-审批不通过) -->

                </el-table>


                <div slot="footer" class="dialog-footer">
                    <el-button type="primary" @click="flowNodedia=false" icon="el-icon-check" size="small">{{ $t("public.define") }}</el-button>
                </div>
            </el-dialog>

        </div>
        </list-layout>

    </div>
</template>

<script>
import {approvalListAPI,flowNodeAPI,InspectionFormdeleteAPI,undoToDoAPI} from "@/api/costShift"
export default {
    name: 'editMaterial',
    dicts: [

    ],
    components: {
    },
    data() {

        return {
            showSearch: true,
            tableHeight: 'calc(100vh - 308px)',

            typeOpen: false,
            queryParams:{
                pageNum:1,
                pageSize:10,
                shiftOrder:''
            },
            factoryList: [],
            // 遮罩层
            loading: false,
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            stemList: [],
            // 总条数
            total: 0,
            // 字典表格数据
            incomingList: [],
            // 弹出层标题
            title: '',
            // 是否显示弹出层
            open: false,
            // 表格数据
            dataList:[],
            selection:[],
            // 状态(0-待提交;1-待审批;2-审批中;8-不通过;9-通过)
            statuelist:[
                {value:0,label:"待审批"},
                {value:1,label:"审批通过"},
                {value:2,label:"审批不通过"}
            ],
            flowNodeinfo:{},
            flowNodedia:false
        }
    },

    mounted() {



    },
    created() {
      var query=  this.$route.query
        if (query?.id) {
            this.queryParams.shiftOrder=query.id
        }
        if (query?.noticeType==1) {
            this.changeundoToDo(query.taskId)
        }
        this.getList()
    },

    methods: {
        changeundoToDo(id){
            undoToDoAPI(id).then(res=>{
                if (res.code==200) {
                    this.$message.success('订单已转待办')
                }
            })
        },
        seeissue(row){
            flowNodeAPI(row.id).then(res=>{
                if (res.code==200) {
                    this.flowNodeinfo=res.data
                    this.flowNodedia=true
                }
            })
        },

        formatstatue(e) {
            if (e || e==0) {
                let obj = this.statuelist.find((item) => {
                    return item.value == e
                })
                if (obj) {
                    return obj.label
                } else {
                    return ''
                }
            } else {
                return ''
            }
        },
        addInspection(){
            this.$router.push({ path: '/costShift/costForm?id=0' })
        },

        handleQuery(){
            this.queryParams.pageNum=1

            this.getList()
        },
        // 查看
        onInfo(row) {
            this.$router.push({ path: '/costShift/costForm/'+row.id+"?view=2&approvalNodeId="+row.approvalNodeId })
        },
         /**  发起巡检任务 */
        handleAdd(row) {
            this.$router.push({ path: '/costShift/costForm?id='+row.id })
        },

        close(){
            // this.typeModel= { }
            this.$refs.typeModel.resetFields();
        },
        // 删除
        onDelete(row) {
            this.$modal.confirm(this.$t('formValidation.doYouConfirmDeletion')).then(() => {
                InspectionFormdeleteAPI(row.id).then((response) => {
                    if (response.code == 200) {
                        this.$modal.msgSuccess(this.$t('tips.deleteSuccess'))
                        this.getList()
                    }
                })
            })
        },

        /**  类型列表 */
        getList() {
            this.loading = true
            var data={
                ...this.queryParams
            }
            approvalListAPI(data).then((response) => {
                if (response.code==200) {
                    this.dataList = response.rows

                    this.total = response.total
                    this.loading = false

                }
            })
        },
        // 取消按钮
        resetQuery() {

            this.queryParams={
                 pageNum:1,
                pageSize:20
            }
            this.getList()
        },



    },
}
</script>
<!-- <style lang="scss" scoped>@import './index.scss';</style> -->
